﻿<%@ Control Language="C#" AutoEventWireup="true" CodeFile="UboxMessageBoard.ascx.cs" Inherits="UserControl_UboxMessageBoard" %>

<style>
    .message-board-content{
        cursor: default;
        width: 600px;
        padding: 15px;
        border-radius: 6px;
        background-color: #fff;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
    }
    @media screen and (max-width:649px) {
    
    .message-board-content{
        width:100%;
        margin-top:20px;
        margin-bottom:30px;
        margin-left:3px;
        /*margin:0 auto;*/
    }
    
 
}
    .message-board-top{
    }
    .message-board-middle{
    }
    .msg-container{
        margin-bottom: -5px;
    }
    .msg-container>h5, h6, img{
        display: inline;
    }
    .msg-container img{
        width: 40px;
        height: 40px;
    }
    .msg-container p{
        margin: 25px 0 -10px 0;
    }
    .message-board-bottom {
        overflow: auto;
        border-top:1px solid #DDD;
        border-bottom:1px dashed #DDD;
        padding-top:15px;
        padding-bottom:20px;
        margin-bottom:10px;
    }
    .message-board-bottom button{
        margin-top: 5px;
        margin-right:5px;
        float: right;

    }
    .msg-user {
        margin-left:5px;
        vertical-align:bottom;
    }
    .msg-time {
        float:right;
    }
    .TextMessage {
        margin-top:15px;
    }
    .report-badmessage-board {
         float: right;
            color: #ccc;
            text-decoration: none;
            margin-top: 7px;
            padding-right:3px;
            padding-left:10px;
    }
        .report-badmessage-board:hover {
             color: #ff0000;
                /*color: #3399f3;*/
                /*color: #2e52f8;*/
                text-decoration: none;
        }
    .remove-badmessage-board {
        float: right;
            color: #ccc;
            text-decoration: none;
            margin-top: 7px;
            padding-right:3px;
            padding-left:10px;
    }
        .remove-badmessage-board:hover {
            color: #000;

    }
   
</style>

<div class="message-board-content">
    <div class="register-logo">
        <h4>&nbsp;<i class="glyphicon glyphicon-comment"></i>&nbsp;&nbsp;<strong>留言</strong></h4>
    </div>

    <div class="message-board-top"></div>
    <div class="message-board-middle">
        <div class="message-board-bottom">
            <div class="msg-container">
                <%--<a href="#" id="report" class="remove-badmessage-board" title="刪除"><i class="glyphicon glyphicon-remove"></i></a>--%>
                <%--<a href="#" id="report" class="report-badmessage-board" title="檢舉"><i class="glyphicon glyphicon-eye-open"></i>&nbsp;檢舉</a>--%>
                <img class="msg-img" src="images/noname.jpg" /><h5 class="msg-user">未登入</h5>
               <%-- <input type="text" id="TextMessage" class="TextMessage form-control input-sm" />--%>
                <script src="packages/ckeditor/ckeditor.js"></script>
                    <textarea id="TextMessage" class="ckeditor TextMessage form-control input-sm"></textarea>
                <button type="button" id="ButtonMessgae" class="ButtonMessgae btn btn-danger btn-sm">送出</button>
                
            </div>
        </div>
        <div id="MessageStart">
        </div>
    </div>
</div>         


<script>
    //點到登入表單 不要氣泡至login-container引發hideLoginContainer()
    $('.message-board-content').click(function (event) {
        event.stopPropagation();
    });
</script>